//实现顺序:
//1.创建模板字符串
//2.创建底部栏初始化函数
//3.函数中创建底部栏名称对象items=[ {key:'',text:''},{..}]
//4.循环遍历修改底部栏模板字符串
//5.找到当前页面路径名称,通过'/'符号使用split方法分割成数组;
//6.通过标签选择器添加类名
(function () {
	//底部栏模板字符串
	//href="../$key/$key.html" 是用于页面跳转的模板字符串
	var itemTmpl = '<a class="$key btn-item" href="/MeituanPR/$key/$key.html">' +
						'<div class="tab-icon"></div>'+
						'<div class="btn-name">$text</div>'+
				   '</a>';

	//初始化底部栏
	function init() {
		var items = [
			{
				key:'index',
				name:'首页'
			},
			{
				key:'order',
				name:'订单'
			},
			{
				key:'my',
				name:'我的'
			}
		];

		var str = '';
		items.forEach(function (item) {
			//循环将itemTmpl中的所有'$key'值 $text值 替换
			str += itemTmpl.replace(/\$key/g,item.key)
							.replace('$text',item.name);
		});

		$('.bottom-tab').append($(str));

		/**
		 * 底部栏激活状态逻辑判定
		 * param
		 */
		//找到当前页面的url来确定key值
		var arr = window.location.pathname.split('/');
		var page = arr[arr.length - 1].replace('.html','');
			//选择有page类名的a标签,并将a标签添加active类名
		$('a.' + page).addClass('active');
	}

	init();
	
})();